import { useState } from 'react'
import { message, Button, } from 'antd'
import { skyDebounce } from '@inbiz/utils'
export const messageInbiz = (savePage: Function, cancel: Function) => {
  return message.warn({
    content: <Message savePage={savePage} cancel={cancel} />,
    key: 'inbiz-message-keyone'
  })
}


interface IMessage {
  savePage: Function
  cancel: Function
}
const Message = (prop: IMessage) => {

  return <div style={{ display: 'inline-block', fontSize: 14 }}>
    检测到页面内容已发生更改,您希望保存这些更改吗?
    <Button size='small' style={{ margin: '0 10px 0 20px', fontSize: 12 }} onClick={() => {
      message.destroy('inbiz-message-keyone')
      prop.cancel && prop.cancel()
    }}>取消</Button>

    <Button type='primary' size='small' style={{ fontSize: 12 }} onClick={() => {
      message.destroy('inbiz-message-keyone')
      skyDebounce(() => {
        prop.savePage && prop.savePage()
      }, 0)
    }}>保存</Button>
  </div>
}
